<div class="map-com">
    <span class="sline"></span>
    <span class="text">分析参数</span>
</div>
<form nz-form class="map-form">
    <nz-form-item class="item">
        <nz-button-group style="display: flex;margin-left: 22px;">
            <nz-upload nzAction="{{ffs.getShapeAnalyseUploadUrl()}}" [nzMultiple]="false" [nzAccept]="'.zip'"
                [nzShowUploadList]="false" [(nzFileList)]="files" name="files" (nzChange)="iUploadOption($event)">
                <button nz-button><span>shape</span></button>
            </nz-upload>
            <nz-upload nzAction="{{ffs.getCadAnalyseUploadUrl()}}" [nzMultiple]="false" [nzAccept]="'.dxf'"
                [nzShowUploadList]="false" [(nzFileList)]="files" name="files" (nzChange)="iUploadOption($event)">
                <button nz-button><span>cad</span></button>
            </nz-upload>
            <nz-upload nzAction="{{ffs.getGpsAnalyseUploadUrl()}}" [nzMultiple]="false" [nzAccept]="'.txt'"
                [nzShowUploadList]="false" [(nzFileList)]="files" name="files" (nzChange)="iUploadOption($event)">
                <button nz-button><span>gps</span></button>
            </nz-upload>
            <nz-upload nzAction="{{ffs.getExcelAnalyseUploadUrl()}}" [nzMultiple]="false" [nzAccept]="'.xlsx,.xls'"
                [nzShowUploadList]="false" [(nzFileList)]="files" name="files" (nzChange)="iUploadOption($event)">
                <button nz-button><span>excel</span></button>
            </nz-upload>
        </nz-button-group>
        <ng-container *ngFor="let fj of files">
            <div style="width: 100%;margin-left: 22px;margin-top: 5px;">
                <a>{{fj.name}}</a>
            </div>
        </ng-container>
    </nz-form-item>

    <nz-form-item class="item fm-input2">
        <nz-select [(ngModel)]="oa.gas.layerName" [ngModelOptions]="{standalone: true}"
            (nzOpenChange)="ds.load('0',true)" (ngModelChange)="iChange($event)" [nzPlaceHolder]="'分析图层'">
            <ng-container *ngFor="let option of ds.datas">
                <nz-option *ngIf="option.valid == true" [nzLabel]="option.display" [nzValue]="option.id"></nz-option>
            </ng-container>
        </nz-select>
    </nz-form-item>
    <!-- <nz-form-item class="item fm-input2">
        <input nz-input [(ngModel)]="oa.gas.buffer" [ngModelOptions]="{standalone: true}" placeholder="缓冲距离" />
    </nz-form-item> -->
    <nz-form-item class="item fm-input2">
        <nz-select [(ngModel)]="oa.gas.statisticsCateory" [ngModelOptions]="{standalone: true}"
            [nzPlaceHolder]="'统计类别'">
            <nz-option *ngFor="let option of oa.categorysDic" [nzLabel]="option.label" [nzValue]="option.value">
            </nz-option>
        </nz-select>
    </nz-form-item>
    <nz-form-item class="item fm-input2">
        <nz-select [(ngModel)]="statisticsField" [ngModelOptions]="{standalone: true}" [nzPlaceHolder]="'统计字段'">
            <nz-option *ngFor="let option of oa.statisticsDic" [nzLabel]="option.label" [nzValue]="option.value">
            </nz-option>
        </nz-select>
    </nz-form-item>
    <!-- <nz-form-item class="item">
        <nz-select [(ngModel)]="oa.gas.showField" nzMode="multiple" [ngModelOptions]="{standalone: true}"
            [nzPlaceHolder]="'显示字段'">
            <nz-option *ngFor="let option of oa.showDic" [nzLabel]="option.label" [nzValue]="option.value">
            </nz-option>
        </nz-select>
    </nz-form-item> -->
    <nz-form-item class="item tc">
        <nz-button-group>
            <button nz-button [nzType]="'primary'" [nzLoading]="oa.isLoading"
                (click)="iStartAnalysis()">分析</button>
            <button nz-button [nzLoading]="exportIsLoading"
                (click)="exportWord('overlayAnalysis.html','叠加分析成果.docx')">导出</button>
            <button nz-button [nzLoading]="isLoading" (click)="iReset()">重置</button>
        </nz-button-group>
    </nz-form-item>
</form>


<div *ngIf="!analysis" class="map-com">
    <span class="sline"></span>
    <span class="text">分析结果</span>
</div>


<div *ngIf="analysis" class="map-com">
    <span class="sline"></span>
    <span class="text">统计图</span>
</div>

<div [hidden]="!analysis" class="clear">
    <div id="statistics_chart" style="width: 290px; height: 320px;"></div>
</div>

<div *ngIf="analysis" class="map-com">
    <span class="sline"></span>
    <span class="text">统计表</span>
</div>

<div *ngIf="analysis" class="work-content clear" style="width: 290px">
    <div class="table-b">
        <nz-table [nzVirtualItemSize]="54" [nzFrontPagination]="false" [nzShowPagination]="false"
            [nzScroll]="{ y: '240px' }" nzSize="middle" [nzData]="statisticsList" [nzLoading]="oa.isLoading">
            <thead>
                <tr>
                    <th fm-input2>{{statisticsCateoryName}}</th>
                    <th fm-input2>{{statisticsFieldName}}</th>
                </tr>
            </thead>
            <tbody>
                <tr *ngFor="let data of statisticsList">
                    <ng-container *ngFor="let item of data">
                        <td fm-input2>{{item}}</td>
                    </ng-container>
                </tr>
            </tbody>
        </nz-table>
    </div>
</div>

<div *ngIf="analysis" class="map-com">
    <span class="sline"></span>
    <span class="text">详情表</span>
</div>
<div *ngIf="analysis" class="work-content clear" style="width: 400px; overflow-x: scroll;">
    <div class="table-b">
        <nz-table nzSize="middle" nzShowSizeChanger [nzPageSizeOptions]='[ 5, 10, 15, 20, 30, 40, 50 ]'
            [nzFrontPagination]="false" [nzData]="pageList" [nzLoading]="oa.isLoading" [nzTotal]="oa.rowsCount"
            [(nzPageIndex)]="oa.pageIndex" [(nzPageSize)]="oa.pageSize" (nzPageIndexChange)="loadPage()"
            (nzPageSizeChange)="loadPage()">
            <thead>
                <tr>
                    <ng-container *ngFor="let item of oa.showDic">
                        <th>{{item.label}}</th>
                    </ng-container>
                </tr>
            </thead>
            <tbody  (mouseout)="clearHighlight()">
                <ng-container *ngFor="let data of pageList ; let i = index">
                    <tr (mouseenter)="layerHighlight(i)">
                        <ng-container *ngFor="let item of oa.showDic ;let j = index ">
                            <td>{{data[item.value]}}</td>
                        </ng-container>
                    </tr>
                </ng-container>
            </tbody>
        </nz-table>
    </div>
</div>